 
<span style="font-size:14px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8"> 
    <title>富文本编辑器</title> 
    </head> 
    <body> 
    <fieldset> 
    <legend>编辑区</legend> 
    <div> 
    <form> 
    字体颜色： 
    <select onchange="setFontColor(this)"> 
    <option value="black">Black </option> 
    <option value="red">Red </option> 
    <option value="green">Green </option> 
    <option value="blue">Blue </option> 
    </select> 
    字体样式： 
    <select onchange="setFontStyle(this)"> 
    <option value="bold">加粗 </option> 
    <option value="italic">倾斜 </option> 
    <option value="underline">下划线 </option> 
    <option value="striketthrough">无 </option> 
    </select> 
    字体名称： 
    <select onchange="setFontFamily(this)"> 
    <option value="serif">衬线体 </option> 
    <option value="sans-serif">无衬线</option> 
    <option value="monospace">等宽 </option> 
    <option value="comic sans ms">Comic Sans </option> 
    </select> 
    </form> 
    </div> 
    <br/> 
    <div id="editableText" contenteditable="true" style="width:400px;min-height:100px;border:2px dashed #ccc"></div> 
    </fieldset> 
    <script type="text/javascript"> 
    function setFontColor(obj) 
    { 
    document.execCommand("forecolor",false,obj.value); 
    } 
    function setFontStyle(obj) 
    { 
    document.execCommand(obj.value,false,null); 
    } 
    function setFontFamily(obj) 
    { 
    document.execCommand("fontname",false,obj.value); 
    } 
    </script> 
    </body> 
    </html></span> 